<template>
	<view class="yp padd30">
		<view class="title">第三方登录</view>
		<view class="thirdLogin">
			<u-icon name="qq-fill" color="#2979ff" size="60" @click="Login_QQ"></u-icon>
			<u-icon name="weixin-fill" color="green" size="60" @click="$pub.Toast('功能开发中~')"></u-icon>
			<u-icon name="weibo" color="red" size="60" @click="$pub.Toast('功能开发中~')"></u-icon>
			<u-icon name="github-circle-fill" color="black" size="60" @click="$pub.Toast('功能开发中~')"></u-icon>
			<u-icon name="zhifubao" color="#2979ff" size="60" @click="$pub.Toast('功能开发中~')"></u-icon>
			
		</view>
		
	</view>
</template>

<script>
import {API$register_thirdparty} from '../../../../common/API/other.js';
// MD5加密
import MD5 from '@/common/Tools/md5.js'
export default {
	name: '',
	methods: {
		Login_QQ() {
			uni.showLoading({mask:true,title:"启动中"})
			uni.login({
				provider: 'qq',
				success: async QQRes => {
					console.log("uni.login返回的数据",QQRes.authResult);  // openID是不变的
					uni.getUserInfo({
						provider: 'qq',
						success: async infoRes => {
							console.log(infoRes);
							let options = {
								way:'qq',
								openid:QQRes.authResult.openid,
								Nickname:infoRes.userInfo.nickname,
								sex:infoRes.userInfo.gender,
								avatar:infoRes.userInfo.figureurl_qq
							}
							let res = await API$register_thirdparty(options)  // 拿openid去注册账号
							console.log('拿openID注册账号返回的参数：',res)
							if(res.code==200){
								this.$pub.Toast('登录成功~')
								console.log('登录成功')
								this.$pub.setStorageSync('Sts', res.Sts);
								this.$pub.setStorageSync('Token',res.token)
								this.$pub.setStorageSync('UserInfo',res.data)
								this.$pub.swiTab('/pages/index/index');
								
								
								
								// 取账号缓存
								let oldAccountList = this.$pub.getStorageSync('AcclountList')
								let indexS = oldAccountList ? oldAccountList.findIndex(i => i._id === res.data._id) : -1
								// 账号缓存不存在
								if (!oldAccountList || indexS === -1) {
									oldAccountList = oldAccountList ? oldAccountList :[],
									oldAccountList ? oldAccountList.forEach(i=>i.IsCheck=false) :""
									let AccontJson = [{
										UpdateDate: new Date(),
										Token: res.token,
										IsCheck:true ,// 当前选中的登录的账号
										Account: res.data.account,
										Nickname: res.data.Nickname,
										Avatar: res.data.avatar,
										_id: res.data._id,
										
										Info:res.data
									}]
									this.$pub.setStorageSync('AcclountList', [...oldAccountList,...AccontJson]); // 添加账号缓存
								// 账号缓存存在 覆盖掉旧数据
								} else {
									oldAccountList.forEach(i=>i.IsCheck=false)
									
									console.warn('我是覆盖的逻辑', oldAccountList, oldAccountList[indexS])
									oldAccountList[indexS].UpdateDate = new Date();
									oldAccountList[indexS].Token = res.token;
									oldAccountList[indexS].Nickname = res.data.Nickname;
									oldAccountList[indexS].Avatar = res.data.avatar;
									oldAccountList[indexS].IsCheck = true;
									
									oldAccountList[indexS].Info = res.data;
									this.$pub.setStorageSync('AcclountList', [...oldAccountList]); // 添加账号缓存
								}
								
								
								// 环信IM登录
								try{
									this.$HuanxinIM.close()
								}catch(e){
									console.log('初始化登录IM',e)
								}finally{
									setTimeout(async()=>{
										console.log('登录IM')
										// 登录IM
										let {msg,IM_data} = await this.$HuanxinIM.Login({
											user:res.data._id,
											pwd: MD5(options.openid)
										})
										if(msg==='fail'){
											this.$pub.Toast('账号密码错误~',IM_data)
											this.$pub.reLaunch('/pages/other/login/index')
										}
										console.log(IM_data)
										this.$pub.setStorageSync('HuanXinInfo',IM_data)
									},2500)
								}
								
							}
						},
						fail: async(e)=> {
							console.error(e);
							this.$pub.Toast('获取用户信息失败，请重试')
						}
					});
				},
				fail: async err => {
					console.error(e);
					this.$pub.toast('获取用户信息失败，请重试')
					console.error(err);
				}
			});
			setTimeout(()=>{
				uni.hideLoading()
			},3000)
		}
	}
};
</script>

<style lang="less" scoped>
.yp {
	position: fixed;
	bottom: 0;
	width: 100%;
	font-size: 28rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	.title {
		width: 480rpx;
		text-align: center;
		border-bottom: 1px solid #ebebeb;
		padding-bottom: 10rpx;
		font-size: 30rpx;
	}
	.thirdLogin {
		padding: 20rpx 0;
		width: 480rpx;
		display: flex;
		justify-content: space-between;
		[class^='cuIcon'] {
			font-size: 70rpx;
			padding: 0 20rpx;
		}
	}
}
</style>
